<!--    客户管理-客户详情  by jh   -->
<template>
    <div>
        <!--样式设置-->
        <div class="ca-p-20">
            <el-row>
                <el-col :span="20">
                    <div class="ca-title"><h3 class="h3">客户详情：</h3></div>
                </el-col>
                <el-col :span="4" >
                    <div class="ca-pull-right">
                         <el-button type="text" @click="toDetailEdit"
                                   :disabled="!isAuthEdit" class="ca-edit-btn el-icon-edit">
                            编辑
                        </el-button>
                    </div>
                </el-col>
            </el-row>
            <el-form  label-width="120px" :model="tableData" class="ca-form-show">
                <div class="ca-box ca-p-20 ca-m-t-10">
                    <h3 class="tab-pane-title">客户关系</h3>
                    <el-row  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="客户关系：">
                                {{tableData.gustStr?tableData.gustStr : ''}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="客户等级：">
                                {{tableData.listGuest? tableData.listGuest[0].guestLevel :'' | getNameById('guestGrade')}}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="归属员工：">
                                {{tableData.staff? tableData.staff :'' }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="归属部门：">
                                {{tableData.dept? tableData.dept :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <div class="ca-box ca-p-20 ca-m-t-20">
                    <h3 class="tab-pane-title">基础资料</h3>
                    <el-row  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="客户名称：" >
                                {{tableData.guestName}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="生日：" >
                                {{tableData.guestBirthday? tableData.guestBirthday:''}}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="客户类型：">
                                {{tableData.listBasic? tableData.listBasic[0].guestType:'' | getNameById('guestType')}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="职务：">
                                {{tableData.listBasic? tableData.listBasic[0].guestPost :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="证件类型：">
                                {{tableData.listBasic? tableData.listBasic[0].credentialsType  :'' | getNameById('guestCodeType')}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="证件号码：" >
                                {{tableData.listBasic? tableData.listBasic[0].credentialsCode :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row   :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="联系人：">
                                {{tableData.listBasic? tableData.listBasic[0].contact:'' }}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="性别：">
                                {{tableData.gender? tableData.gender:'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="联系电话：">
                                {{tableData.listBasic? tableData.listBasic[0].phone:''}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="E-mail："  >
                                {{tableData.listBasic? tableData.listBasic[0].mail:'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row class="row-padding row-col-4"  :gutter="10">
                        <el-col :span="12">
                            <el-form-item label="通信地址：">
                                {{tableData.listBasic? tableData.listBasic[0].address:''}}
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="邮编：">
                                {{tableData.listBasic? tableData.listBasic[0].code:'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <div class="ca-box ca-p-20 ca-m-t-20">
                    <h3 class="tab-pane-title">客户特征</h3>
                    <el-row   :gutter="10">
                        <el-col >
                            <el-form-item label="客户兴趣爱好：">
                                {{tableData.listGuest? tableData.listGuest[0].guestHobby :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row  :gutter="10">
                        <el-col >
                            <el-form-item label="客户需求描述：">
                                {{tableData.listGuest? tableData.listGuest[0].guestDescription :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row  :gutter="10">
                        <el-col >
                            <el-form-item label="其他：">
                                {{tableData.listGuest? tableData.listGuest[0].other :'' }}
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
            </el-form>
        </div>
    </div>
</template>
<script type="text/ecmascript-6">
    import { isNoAuth } from '__service/utils';
    export default {
        props: {
            toDetailEdit: {
                type: Function,
                required: true
            },
            tableData: {
                type: Object,
                required: true
            },
        },
        data() {
            return {
                //后台数据
                backstageData: this.tableData,
                isAuthEdit: isNoAuth('客户管理-客户信息-编辑'),
            }
        },
        watch: {
        },
        mounted() {
            //console.log(this.tableData,"详情页数据ssss")
        },
        methods: {
        },
        components: {
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    //客户管理 --公共样式
    .ca-client-topic{
        margin-bottom: 20px;
        div{
            text-align: center;
            span{
                display: inline-block;
                width:100%;
                height:1px;
                background:#000;
            }
        }
    }
    //空间居中
    .padding-set{
        /*margin-top: 20px;*/
        padding:0 5%;
    }
    .el-form-item{
        margin-bottom: 0;
    }
</style>
